<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>决定主轴的方向</title>
		<style type="text/css">
			/* 容器  项目 */
			.content {
				display: flex;
				flex-direction:column-reverse;
				
				/* row （默认值）：左→右
			row-reverse 主轴为水平方向，起点在右端。
			column 主轴为垂直方向，起点在上沿。
			column-reverse 主轴为垂直方向，起点在下沿
			*/
			}
		</style>
	</head>
	<body>
		<div class="content">
			<div class="item">
				子元素1
			</div>
			<div class="item">
				子元素2
			</div>
			<div class="item">
				子元素3
			</div>
			<div class="item">
				子元素4
			</div>
		</div>
	</body>
</html>
